<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html
	class=" js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients no-cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg no-smil svgclippaths">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">


<link href="/css/csstree.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/switchery.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-clockpicker.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-table.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap-select.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/core.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/components.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/icons.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/pages.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/responsive.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/sweetalert.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/custombox.min.css" rel="stylesheet">
<link href="../css/zcss/animate.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/css.css" rel="stylesheet" type="text/css">

<link href="../css/zcss/bootstrap-datepicker3.min.css" rel="stylesheet">
<link href="../css/zcss/switchery.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-clockpicker.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-table.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap-select.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/core.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/components.css" rel="stylesheet" type="text/css">

<!--图标的外部样式-->
<link href="http://cdn.xtcrm.com/cdn//v7/fm/ub/css/icons.css"
	rel="stylesheet" type="text/css">
<!--图标的外部样式-->

<link href="../css/zcss/pages.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/responsive.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/sweetalert.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/custombox.min.css" rel="stylesheet">
<link href="../css/zcss/animate.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/css.css" rel="stylesheet" type="text/css">


<script src="http://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<!-- 引入样式 -->
<link rel="stylesheet"
	href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script type="text/javascript" src="../js/axios.js"></script>
<script type="text/javascript" src="../js/qs.js"></script>

<title>编辑订单明细</title>

<script type="text/javascript" src="js/jquery-3.1.0.js"></script>
<script type="text/javascript">
			$(function() {
				//alert($("#cartdiv").offset().left);
				//$("#cartbtn").huadong($("#cartdiv"),$("#cartbtn"),2000);

				$("#cartdiv").css("left", $("#cartdiv").offset().left + 550);
				$("#cartbtn").click(
					function() {
						//alert("jinlai" + $("#cartdiv").css("width") + "sdfs"	+ $("#cartdiv").attr("title"));
						var types = $("#cartdiv").attr("title");
						//alert("sss");
						var div = $("#cartdiv");
						if(types == "hiddens") {
							//alert("准备出来");
							$("#cartdiv").attr("title", "show");
							$("#cartdiv").animate({
								left: "-=" + 550
							}, 500);
							//$("#cartdiv").css("title","show");
						} else if(types == "show") {
							$("#cartdiv").attr("title", "hiddens");
							$("#cartdiv").animate({
								left: "+=" + 550
							}, 500);
							//$("#cartdiv").css("title","hiddens");
						}

					});

			});
		</script>

</head>

<body>
	<div class="goodsBox">

		<div class="enlarged forced" id="wrapper">
			<div class="content">
				<div class="container">
					<p>
						产品树图示说明 <i title="" class="fa fa-shopping-cart"
							data-original-title="计算库存" data-toggle="tooltip"
							data-placement="bottom"></i>：计算库存 <img src="../images/sno.gif"
							border="0">：有序列号 <img src="../images/9pro.png" border="0">：本品有其它规格
						<img src="../images/9pop.png" border="0">点它查看：多价格，历史价格，多规格，多币种
					</p>

					<!--点击滑动出选择商品的框-->
					<a class="font-box bg-primary p-t-20 position-plus" id="cartbtn"
						style="right: 100px; display: block; z-index: 2; cursor: move;">
						<i title="" class="fa fa-plus fa-3x" id="toggle_product_tree"
						style="cursor: pointer;" data-original-title=""
						data-toggle="tooltip" data-placement="left" data-title="添加产品"></i>
					</a>

					<div class="row">
						<!--选择商品-->
						<div tabindex="0" id="cartdiv" title="hiddens"
							class="card-box draggable bg-light" id="mingxi_float_select"
							style="background: rgb(255, 255, 255); width: 500px; height: 80%; right: 30px; display: inline-block; position: absolute; z-index: 1; overflow-y: scroll;">
							<p>
								<strong>选择产品</strong> <a
									onclick="toggle_product_tree($('#mingxi_float_select'))"
									href="javascript: void(0);"><i title=""
									class="fa fa-minus text-primary pull-right fa-lg"
									id="mingxi_float_select_close" data-original-title=""
									data-toggle="tooltip" data-placement="left" data-title="最小化"></i></a>
							</p>

							<h5>
								<b>方法3.<i class="fa fa-check m-l-5"></i>点击选择产品：
								</b>
							</h5>
							<div class="slimScrollDiv"
								style="width: auto; height: 533px; overflow: hidden; position: relative;">
								<div class="card-box2" id="pro_tree"
									style="width: auto; height: 100%; overflow: hidden; overflow-y: scroll">
									
									<div class="CssTree" id="CssTree">

										<!--树形结构-->
										<el-input placeholder="输入关键字进行过滤" v-model="filterText">
										</el-input>

										<el-tree class="filter-tree" :data="data2"
											:props="defaultProps" default-expand-all
											:filter-node-method="filterNode" ref="tree2"
											@node-contextmenu="leftclicks" @node-click="rightbtnclicks">
										</el-tree>

										<!--树形结构-->

									</div>
								</div>
								<div class="slimScrollBar"
									style="background: rgb(0, 0, 0); border-radius: 7px; top: 0px; width: 7px; height: 180.38px; right: 1px; display: none; position: absolute; z-index: 99; opacity: 0.4;"></div>
								<div class="slimScrollRail"
									style="background: rgb(51, 51, 51); border-radius: 7px; top: 0px; width: 7px; height: 100%; right: 1px; display: none; position: absolute; z-index: 90; opacity: 0.2;"></div>
							</div>
						</div>
						<!--选择商品-->

						<div class="col-sm-12" style="width: 100%;overflow: auto; position: relative;">
							<div class="slimScrollDiv"
								style="width: auto; height: 728px; overflow: hidden; position: relative;">
								<div id="mindxi_container"
									style="width: auto; height: 728px; overflow: auto;">
									<p align="center">
										<script>
												var Txxtt = 1;
											</script>
									</p>
									<table style="display: none">
										<tbody id="TS_xxtt">
											<tr>
												<td style="vertical-align: middle;"><input
													name="dt_goods_name_srkjdslABHSAS" type="hidden" value="">
													<div id="dt_goods_name_srkjdslABHSAS_vshow"></div></td>
												<td style="width: 170px;"><input
													name="dt_goods_un_price_srkjdslABHSAS"
													class="form-control text-right"
													onchange='CompPrice(srkjdslABHSAS);compStatisticalFigures("goods");'
													type="text" value=""></td>
												<td style="width: 170px;"><input
													name="dt_goods_amount_srkjdslABHSAS"
													class="form-control text-right"
													onchange='CompPrice(srkjdslABHSAS);compStatisticalFigures("goods");'
													type="text" value="0"></td>

												<td align="right" nowrap=""><input
													name="jzksrkjdslABHSAS" class="form-control"
													style="width: 55px; display: inline-block; margin-right: 5px;"
													onchange='CompPrice(srkjdslABHSAS);compStatisticalFigures("goods");'
													type="text" value="100">%</td>
												<td><input name="dt_goods_sum_srkjdslABHSAS"
													class="form-control text-right"
													onchange='CompZK(srkjdslABHSAS);compStatisticalFigures("goods");'
													type="text" value=""></td>

												<td style="text-align: center;"><textarea
														name="dt_goods_memo_srkjdslABHSAS" class="form-control"
														onclick='$(this).css("min-height", "130px")' rows="1"></textarea></td>
												<td nowrap=""><input name="dt_goods_id_srkjdslABHSAS"
													type="hidden" value="0"><input
													name="dt_goods_sort_cd_srkjdslABHSAS" type="hidden"
													value="0"> <a style=""
													onclick="fnConfirmDelete('xxtt',srkjdslABHSAS,'dt_goods','name');"
													data-original-title="删除" data-toggle="tooltip"
													data-placement="bottom"><i class="fa fa-trash-o"></i></a> <a
													onclick="trUpDown(this,-1)" data-original-title="向上"
													data-toggle="tooltip" data-placement="bottom"><i
														class="ion-arrow-up-b"></i> </a> <a
													onclick="trUpDown(this,1);" data-original-title="向下"
													data-toggle="tooltip" data-placement="bottom"><i
														class="ion-arrow-down-b"></i> </a></td>
											</tr>
										</tbody>
									</table>
									订单明细 致： <strong><span
										style="font-weight: normal; color: #9e9e9e">〖</span>华那商场<a
										href="javascript:vopen('/xcrm/customer/customer/detail.xt?id=182','customer182',999,600);"><i
											class="fa fa-folder-open m-l-5" data-original-title="打开详细页面"
											data-toggle="tooltip" data-placement="bottom"></i></a><span
										style="font-weight: normal; color: #9e9e9e">〗</span></strong> 日期： <strong>2018-12-29</strong>
									<p></p>
									<form name="mform"  
										style="min-height: 600px;width: 100%" >
										<p></p>
										<div class="bootstrap-table">
											<div class="fixed-table-container">
												<table class="table table-condensed"  >
													<thead>
														<tr>
															<th class="th-inner">品名型号/规格[单位]</th>
															<th class="th-inner text-right">单价</th>
															<th class="th-inner text-right">数量</th>
															<th class="th-inner">折扣</th>
															<th class="th-inner">金额</th>
															<th class="th-inner">备注</th>
															<th class="th-inner">操作</th>
														</tr>
													</thead>

													<tbody  >

														<tr v-for="(colle,i) in tableData">
															<td style="vertical-align: middle;"><input
																type="hidden" name="dt_goods_name_1" value="82">{{colle.goods.gooName}}</td>
															<td style="width: 170px;"><el-input
																	:placeholder="colle.goods.gooPrice" :disabled="true"> </el-input></td>
															<td style="width: 170px;">
															
															<!-- <el-input
																	:placeholder="colle.quatity" :value="colle.quatity" type="number" 
																	@keyup.enter.native="deleteDiv($event,colle.goods.gooId)">
																	
																	</el-input> -->
																	
																	<input type="number" :value="colle.quatity" @keyup.enter="deleteDiv($event,colle.goods.gooId)" style="width:152.333px;height: 40px;border:1px solid #CCCCCC;border-radius: 5px;padding-left: 20px">

															</td>

															<td nowrap="" align="right"><el-input
																	placeholder="请输入内容" :disabled="true"> </el-input></td>
															<td><el-input :placeholder="colle.sum" :disabled="true">
																</el-input></td>

															<td style="text-align: center;"><el-input
																	placeholder="请输入内容" :disabled="true"> </el-input></td>
																	
															<td nowrap=""><input type="hidden"
																name="dt_goods_id_1" value="423"><input
																type="hidden" name="dt_goods_sort_cd_1" value="1">
																
																<a style="cursor: pointer;"
																@click.prevent="deleteGoods(colle.goods.gooId)"
																data-toggle="tooltip" data-placement="bottom"
																data-original-title="删除">
																
																<i class="fa fa-trash-o"></i></a>
																<a onclick="trUpDown(this,-1)" data-toggle="tooltip"
																data-placement="bottom" data-original-title="向上"><i
																	class="ion-arrow-up-b"></i> </a> <a
																onclick="trUpDown(this,1);" data-toggle="tooltip"
																data-placement="bottom" data-original-title="向下"><i
																	class="ion-arrow-down-b"></i> </a></td>
														</tr>

													</tbody>
													<tbody>
														<tr id="_tt_xxtt_hj">
															<td style="font-weight: bold;">合计</td>
															<td></td>
															<td id="_total_number">{{quatitys}}</td>
															<!--XTV_TAXRATE_AND_TAXMONEY_TOTAL-->
															<td></td>
															<td id="_total_sum">{{sums}}</td>
															<td></td>
															<td></td>
														</tr>
													</tbody>
												</table>
											</div>
										</div>
										<p></p>
										<p class="text-center m-t-10">

											<!--保存明细-->
											<input name="B1" class="btn btn-d w-lg" id="11"
												v-on:click="subumit"
												type="button" value=" 保存明细数据 "><input name="coid"
												type="hidden" value="175">
										</p>
										<p>
											<!--<span id="#"></span>-->
											操作说明：
										</p>
										<ol>
											<li>点击左侧产品名称，选择产品。<br> 或点击： <img
												src="/images/icons/9pop.png" border="0">
												选择多价格、多规格价格、该客户历史购买价格、多币种价格
											</li>
											<li>填写数量和折扣，空白处点鼠标，自动计算金额</li>
											<li>编辑完成后点击保存明细</li>
										</ol>
									</form>
								</div>
								<div class="slimScrollBar"
									style="background: rgb(0, 0, 0); border-radius: 7px; top: -310px; width: 7px; height: 528px; right: 1px; display: none; position: absolute; z-index: 99; opacity: 0.4;"></div>
								<div class="slimScrollRail"
									style="background: rgb(51, 51, 51); border-radius: 7px; top: 0px; width: 7px; height: 100%; right: 1px; display: none; position: absolute; z-index: 90; opacity: 0.2;"></div>
							</div>
						</div>
					</div>

				</div>
			</div>
		</div>

	</div>

	<script type="text/javascript">
			var mydata = {
				info: "你好，悲催的星期二"
			};
			var app6 = new Vue({
				//element元素(作用域)
				el: ".goodsBox",
				//数据
				data: {
					filterText: '',
					data2: [],
					defaultProps: {
						children: 'children',
						label: 'label'
					},
					tableData:[],
					sums:"",
					quatitys:""
				},
				//写方法
				methods: {
					subumit(){
						//alert("a");
						//完成订单明细
						var iosnn=this;
	                	//post提交数据
						axios.post("submitGoodsDetails",
							//参数转换
							Qs.stringify({
								arrayFormat: 'brackets'
							})		
						).then(function(v) {
							console.info(v.data.odnum);
							var ase =v.data.odnum;
							window.location.href="/shozhongordertwo2?oid="+ase+"";
						}).catch(function(e) {
							alert("出错了"+e);
						});
					},
					deleteGoods(a){
						//alert(a);
						//删除商品
						var iosnn=this;
	                	//post提交数据
						axios.post("deleteGoodToCart",
							//参数转换
							Qs.stringify({'ids':a}, {
								arrayFormat: 'brackets'
							})		
						).then(function(v) {
							iosnn.tableData = v.data.map;
							
							iosnn.sums=v.data.price;
							iosnn.quatitys=v.data.quatitys;
							 console.info(v.data); 
						}).catch(function(e) {
							alert("出错了"+e);
						});
					},
					deleteDiv(event,a){
						//修改商品数量
					//alert(event.target.value+" "+a);
						var sums =event.target.value;
						var iosnn=this;
	                	//post提交数据
						 axios.post("updateGoodToCart",
							//参数转换
							Qs.stringify({'ids':a,'quatitys':sums}, {
								arrayFormat: 'brackets'
							})		
						).then(function(v) {
							iosnn.tableData = v.data.map;
							

							iosnn.sums=v.data.price;
							iosnn.quatitys=v.data.quatitys;
							 console.info(v.data.map); 
						}).catch(function(e) {
							alert("出错了"+e);
						}); 
				},
					rightbtnclicks(a, b, c) {
						console.info(a.id);

						if (a.id!=undefined) {
							var iosnn=this;
		                	//post提交数据
							axios.post("addGoodToCart",
								//参数转换
								Qs.stringify({'ids':a.id}, {
									arrayFormat: 'brackets'
								})		
							).then(function(v) {
								//alert(v);
								iosnn.tableData = v.data.map;
								

								iosnn.sums=v.data.price;
								iosnn.quatitys=v.data.quatitys;
								 console.info(v.data.map); 
							}).catch(function(e) {
								alert("出错了"+e);
							});
						}
						
	                	
					},
					leftclicks(a, b, c, d) {
						console.info(a + " " + b + "" + c + " " + d + " ");
					},
					filterNode(value, data) {
						if (!value) return true;
						return data.label.indexOf(value) !== -1;
					}
				},
				watch: {
					filterText(val) {
						this.$refs.tree2.filter(val);
					}
				},
				mounted() {
					var mas=${treeitems};
					this.data2 = mas;
					console.info(mas);
					
					var cart=${CartBoxAllJson};
					this.tableData = cart.map;
					
					this.sums=cart.price;
					this.quatitys=cart.quatitys;
					console.info(cart); 
				}
			});
		</script>

</body>

</html>